<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>

</html>
<script>
    //发布订阅模式又称 '观察者模式'
    //概念： 发布者
    //概念：订阅者
    //关系：发布者和订阅者是 一对多的关系

    (function () {
        function Observer() {
            this.obj = {}
            //参数一 ： 消息的类型，是string类型
            //参数二 ： 用来接收消息的函数，是function类型
            this.on = function (type, handle) {//订阅消息
                //保存该消息的类型及接收消息的函数
                // this.obj[type] =(this.obj[type]?this.obj[type]:[])
                this.obj[type] = this.obj[type] || []
                this.obj[type].push(handle)
            }
            this.emit = function (type,msg) {//发布消息
                //拿到type对应的这个类型的消息的所有订阅者的回调函数,调用该函数并将消息传给订阅者
                this.obj[type] &&
                this.obj[type].forEach((item)=>{
                    item(msg)
                })
            }
        }
        window.Observer = Observer //暴露Obersever函数到外面
    })()
    //实例化对象
    var os = new Observer()
    //订阅消息
    os.on('ysb', function (msg) {
        //接收来自发布者的消息msg
        console.log('收到了ysb的消息' + msg);
    })
    //订阅消息
    os.on('ysb', function (msg) {
        //接收来自发布者的消息msg
        console.log('收到了ysb的消息' + msg);
    })
    //订阅消息
    os.on('ysb', function (msg) {
        //接收来自发布者的消息msg
        console.log('收到了ysb的消息' + msg);
    })
    os.on('ygp', function (msg) {
        //接收来自发布者的消息msg
        console.log('收到了ygp的消息' + msg);
    })
    // os.on('ysd', function (msg) {
    //     //接收来自发布者的消息msg
    //     console.log('收到了ysd的消息' + msg);
    // })

    //发布消息
    os.emit('ysb','本周六请假')
    os.emit('ygp','本周六可以请假')
    os.emit('ysd','我想回家')
    console.log(os);
</script>